$(function(){
    $('.loginBtn').click(function(){

        if($('input[name="phone"]').val()===''){
            layer.msg('手机不能为空');
            return false
        }
       var reg = /^1[3-9]\d{9}$/;
    //    console.log($('input[name="phone"]').val());
            if(!reg.test($('input[name="phone"]').val())){
                layer.msg('请输入正确的手机号');
                return false
            }
        if($('input[name="password"]').val()===''){
            layer.msg('密码不能为空');
            return false
        }
        var reg =  /^.{6,16}$/;
            if(!reg.test($('input[name="password"]').val())){
                layer.msg('密码不符合规则');
                return false
            }
    
            $.post("PHP/register.php",{
                phone:$('input[name="phone"]').val(),
                password:$('input[name="password"]').val()
            },res=>{
                let {meta:{message,status}} = res
                if(status===1){
                    layer.msg(message,{
                        icon:1,
                        time:1000
                    },function(){
                        location.href ='login.html'
                    })
                }else if(status===2){
                    layer.msg(message,{
                        icon:2,
                        time:1000
                    });
                }
            },'json')
    })
})

//  获取province这个select
var province = document.querySelector('[name="province"]')
// console.log(province)
var city = document.querySelector('[name="city"]')
// ajax悄悄的将省的数据拿回来，渲染在第一个下拉框中
var xhr = new XMLHttpRequest()
xhr.onreadystatechange = function(){
    if(xhr.readyState === 4){
        if(/^2\d{2}$/.test(xhr.status)){
            var res = xhr.responseText;
            // console.log(res); // 如果res是json字符串的话就需要转换成数组或对象 - JSON.parse(json字符串)
            var arr = JSON.parse(res)
            // console.log(res);
            // 遍历数组组成option，放到select中
            // 创建标签 - appendChild放到select中
            for(var i=0;i<arr.length;i++){
                var option = document.createElement('option')
                option.innerText = arr[i].name
                option.setAttribute('value',arr[i].id)
                // 把创建好的每个option放到province中
                province.appendChild(option)

            }
        }
    }
}
xhr.open('get','./php/province.php')
xhr.send()


// 省的下拉框选项发生改变的时候，发送ajax。请求回来市 - 下拉框选项改变 - change
province.onchange = function(){
    // 获取到当前选择的这一项option的value值
    var pid = this.value
    console.log(pid);
    // 发送请求
    var xhr = new XMLHttpRequest()
    xhr.onreadystatechange = function(){
        if(xhr.readyState === 4){
            if(xhr.status>=200 && xhr.status<300){
                var res = xhr.responseText;
                var arr = JSON.parse(res)
                console.log(arr);
                var str = '<option value=0>请选择市</option>';
                for(var i=0;i<arr.length;i++){
                    str += `
                        <option value="${arr[i].id}">${arr[i].name}</option>
                    `
                }
                city.innerHTML = str
            }
        }
    }
    /*
    http请求方式：get查/post增/put改/delete删      /patch/...
    */
    xhr.open('get',`./php/city.php?pid=${pid}`)
    xhr.send()
}

// city.onchange = function(){
//     var pid = this.value;
//     // console.log(pid);
//     var xhr = new XMLHttpRequest()
//     xhr.onreadystatechange = function(){
//         if(xhr.readyState === 4){
//             if(xhr.status>=200 && xhr.status<300){
//                 var res = xhr.responseText;
//                 var arr = JSON.parse(res)
//                 var str = '<option value=0>请选择区/县</option>';
//                 for(var i=0;i<arr.length;i++){
//                     str += `
//                         <option value="${arr[i].id}">${arr[i].name}</option>
//                     `
//                 }
//                 area.innerHTML = str
                
//             }
//         }
//     }
//     /*
//     http请求方式：get查/post增/put改/delete删      /patch/...
//     */
//     xhr.open('get',`area.php?pid=${pid}`)
//     xhr.send()
// }